<template>
    <div class="app-container" style="padding: 20px;">
        <div>
            <el-button @click="()=>triggerModify()">添加</el-button>
        </div>
        <el-table
                ref="multipleTable"
                :data="lists"
                tooltip-effect="dark"
                style="width: 100%"
                @selection-change="(rows)=>selectRows=rows">
            <el-table-column
                    type="selection"
                    width="25">
            </el-table-column>

            <el-table-column
                    label="id" prop="id">
            </el-table-column>

            <el-table-column
                    label="companyId" prop="companyId">
            </el-table-column>

            <el-table-column
                    label="projectId" prop="projectId">
            </el-table-column>

            <el-table-column
                    label="boothNumber" prop="boothNumber">
            </el-table-column>

            <el-table-column
                    label="userName" prop="userName">
            </el-table-column>

            <el-table-column
                    label="password" prop="password">
            </el-table-column>

            <el-table-column
                    label="website" prop="website">
            </el-table-column>

            <el-table-column
                    label="accountName" prop="accountName">
            </el-table-column>

            <el-table-column
                    label="company" prop="company">
            </el-table-column>

            <el-table-column
                    label="companyEn" prop="companyEn">
            </el-table-column>

            <el-table-column
                    label="contact" prop="contact">
            </el-table-column>

            <el-table-column
                    label="contactEn" prop="contactEn">
            </el-table-column>

            <el-table-column
                    label="job" prop="job">
            </el-table-column>

            <el-table-column
                    label="jobEn" prop="jobEn">
            </el-table-column>

            <el-table-column
                    label="portrait" prop="portrait">
            </el-table-column>

            <el-table-column
                    label="email" prop="email">
            </el-table-column>

            <el-table-column
                    label="phone" prop="phone">
            </el-table-column>

            <el-table-column
                    label="mobilePhone" prop="mobilePhone">
            </el-table-column>

            <el-table-column
                    label="tags" prop="tags">
            </el-table-column>

            <el-table-column
                    label="country" prop="country">
            </el-table-column>

            <el-table-column
                    label="province" prop="province">
            </el-table-column>

            <el-table-column
                    label="city" prop="city">
            </el-table-column>

            <el-table-column
                    label="creator" prop="creator">
            </el-table-column>

            <el-table-column
                    label="mendor" prop="mendor">
            </el-table-column>

            <el-table-column
                    label="updateTime" prop="updateTime">
            </el-table-column>

            <el-table-column
                    label="createTime" prop="createTime">
            </el-table-column>

            <el-table-column
                    label="status" prop="status">
            </el-table-column>

            <el-table-column
                    label="remark" prop="remark">
            </el-table-column>

            <el-table-column
                    label="hallNumber" prop="hallNumber">
            </el-table-column>

            <el-table-column
                    label="industry" prop="industry">
            </el-table-column>

            <el-table-column
                    label="nature" prop="nature">
            </el-table-column>

            <el-table-column
                    label="introduction" prop="introduction">
            </el-table-column>

            <el-table-column
                    label="confirmCode" prop="confirmCode">
            </el-table-column>

            <el-table-column
                    label="popular" prop="popular">
            </el-table-column>

            <el-table-column
                    label="expo" prop="expo">
            </el-table-column>

            <el-table-column
                    label="cpc" prop="cpc">
            </el-table-column>

            <el-table-column
                    label="acode" prop="acode">
            </el-table-column>

            <el-table-column
                    label="video" prop="video">
            </el-table-column>

            <el-table-column
                    label="url" prop="url">
            </el-table-column>

            <el-table-column
                    label="videoPopular" prop="videoPopular">
            </el-table-column>

            <el-table-column
                    label="introductionEn" prop="introductionEn">
            </el-table-column>

            <el-table-column
                    label="companyAddress" prop="companyAddress">
            </el-table-column>

            <el-table-column
                    label="companyAddressEn" prop="companyAddressEn">
            </el-table-column>

            <el-table-column
                    label="agree" prop="agree">
            </el-table-column>

            <el-table-column
                    label="onlineExpireTime" prop="onlineExpireTime">
            </el-table-column>

            <el-table-column
                    label="collect" prop="collect">
            </el-table-column>

            <el-table-column
                    label="likes" prop="likes">
            </el-table-column>

            <el-table-column
                    label="beCollect" prop="beCollect">
            </el-table-column>

            <el-table-column
                    label="beLikes" prop="beLikes">
            </el-table-column>

            <el-table-column
                    label="top" prop="top">
            </el-table-column>

            <el-table-column
                    label="synTopExhibit" prop="synTopExhibit">
            </el-table-column>

            <el-table-column
                    label="addTime" prop="addTime">
            </el-table-column>

            <el-table-column
                    label="topOrderBy" prop="topOrderBy">
            </el-table-column>

            <el-table-column
                    label="collectDemand" prop="collectDemand">
            </el-table-column>

            <el-table-column
                    label="collectPurchaser" prop="collectPurchaser">
            </el-table-column>

            <el-table-column
                    label="likesDemand" prop="likesDemand">
            </el-table-column>

            <el-table-column
                    label="likesPurchaser" prop="likesPurchaser">
            </el-table-column>


            <el-table-column
                    prop="address"
                    label="操作"
                    fixed="right">
                <template slot-scope="scope">
                    <el-button type="text" @click="()=>triggerModify(scope.row)">修改</el-button>
                    <el-popconfirm
                            placement="bottom"
                            width="200"
                            trigger="click"
                            title="确定删除吗?"
                            @confirm="()=>deleteOne(scope.row.id)">
                        <el-button slot="reference" type="text" style="padding-left: 10px;">删除</el-button>
                    </el-popconfirm>
                </template>
            </el-table-column>
        </el-table>
        <el-pagination
                style="padding: 20px;"
                :page-size="filter.pageSize"
                layout="prev, pager, next"
                :total="filter.total"
                @size-change="(pageSize)=>{$data.filter.pageSize=pageSize;lists=[];ajaxList();}"
                @current-change="(pageNum)=>{$data.filter.pageNum=pageNum;lists=[];ajaxList();}"
        >
        </el-pagination>

        <!--弹出框-->
        <modify class="vue" ref="modifyDialog" @refresh="()=>ajaxList()"></modify>
    </div>
</template>
<script>

    import {createA} from "../../../utils/utils";

    export default {
        components: {
            modify: () => import('./modify')
        },
        data() {
            return {
                filter: {
                    pageNum: 0,
                    pageSize: 10,
                    total: 0,
                },
                lists: [],
                selectRows: [],
                showModify: false,
            }
        },
        mounted() {
            this.ajaxList();
        },
        methods: {
            async deleteOne(id) {
                var result = await axios.get('/springboot6379/supplier/delete?id=' + id).then(res => res.data).then(res => res.result)
                this.ajaxList();
            },
            triggerModify(data) {
                createA("/supplierDetail?id="+data.id)
                // this.$refs['modifyDialog'].init(data)
            },
            async ajaxList() {
                var _params = {}
                console.log("[get]  /supplier/page")
                console.log('参数', JSON.stringify(_params))
                var result = await axios.get('/springboot6379/supplier/page?pageNum=' + this.filter.pageNum + '&&pageSize=' + this.filter.pageSize + '', _params).then(res=>res.data).then(res => res.result)
                console.log("结果", result)
                this.lists = result.records
                this.filter.total = Number(result.total)
                this.filter.pageSize = Number(result.size)

            }
        }
    }
</script>



